<template>
  <view class="content">
    <view class="content-top">
      <!-- 填写内容 -->
      <view class="posts-main">
        <view class="title">
          <view class="top-title">标题(必填)</view>
          <view class="title-box">
            <u-input
              class="title-input"
              placeholder="请填写标题"
              v-model="title"
              type="textarea"
              maxlength="200"
            />
            <view class="length">0/20</view></view
          >
        </view>
        <view class="textarea">
          <view class="top-title">正文(必填)</view>
          <u-input
            class="title-input"
            placeholder="请填写正文"
            v-model="text"
            type="textarea"
            maxlength="200"
          />
        </view>
        <view class="addimg">
          <u-upload
            :header="header"
            :action="action"
            ref="uUpload"
            :file-list="fileList"
            del-bg-color="#606165"
            del-color="#fff"
          ></u-upload>
        </view>
      </view>
    </view>
    <view class="subBtn">
      <button class="sub">提交</button>
    </view>
  </view>
</template>

<script>
import {
  lk_buyer,
  lk_common,
  lk_expert,
  lk_seller,
  lk_manager,
  lk_consumer,
} from "@/config/myConfig.js";
export default {
  data() {
    return {
      title: "",
      text: "",
      fileList: [],
      show: false,
      header: {
        accessToken: uni.getStorageSync("token"),
      },
      action: `${lk_common}/common/common/upload/file`, //上传图片的地址
    };
  },
  methods: {},
};
</script>

<style lang="scss" scoped>
.content {
  margin-top: 40rpx;
  .content-top {
    padding: 0 30rpx;
    // background-color: #fff;
    .posts-top {
      display: flex;
      justify-content: space-between;
      .save {
        color: #f00;
        border: 2rpx solid #f00;
        border-radius: 40rpx;
        padding: 20rpx 40rpx;
      }
    }
    .posts-main {
      margin-top: 30rpx;
      // padding: 0 30rpx;
      .title {
        // background-color: #fff;
        .title-box {
          background-color: #fff;
          padding-right: 20rpx;
          .length {
            color: #ccc;
            text-align: right;
          }
        }
      }
      .textarea {
        margin-top: 32rpx;
        width: 100%;
        height: 300rpx;
      }
    }
  }
  .title-input {
    background-color: #fff;
    height: 100%;
    padding: 20rpx !important;
  }
  .top-title {
    color: #333333;
    font-size: 30rpx;
    display: flex;
    align-items: center;
    margin-bottom: 18rpx;
  }
  .top-title::before {
    width: 6rpx;
    margin-right: 20rpx;
    display: block;
    content: "";
    height: 28rpx;
    background: #f4333c;
  }
  .subBtn {
    position: fixed;
    bottom: 30rpx;
    width: 100%;
    padding: 30rpx 0;
    .sub {
      background-color: #F4333C;
      width: 80%;
      height: 100rpx;
      line-height: 100rpx;
      text-align: center;
      color: #fff;
      border-radius: 50rpx;
    }
  }
}
.addimg {
  margin-top: 80rpx;
  .upload {
    background-color: #fff;
  }
}
</style>